// pyecharts based js
(function () {
    let containers = document.getElementsByClassName("chart-container");
    if (containers.length > 0) {
        containers[0].style.display = "block";
    }
})()

function showChart(evt, chartID) {
    let containers = document.getElementsByClassName("chart-container");
    for (let i = 0; i < containers.length; i++) {
        containers[i].style.display = "none";
    }

    let tablinks = document.getElementsByClassName("tablinks");
    for (let i = 0; i < tablinks.length; i++) {
        tablinks[i].className = "tablinks";
    }

    document.getElementById(chartID).style.display = "block";
    evt.currentTarget.className += " active";
}

function get_json_result(result){
    // JSCode 在 Web 框架中使用前后端分离模式情况下出现解析异常临时解决方案 ref: https://pyecharts.org/#/zh-cn/faq
    let jsonResult = JSON.stringify(result);
    jsonResult = JSON.parse(jsonResult, function (key, value) {
       if (value.match(/(?:\/\*[\s\S]*?\*\/|\/\/.*?\r?\n|[^{])+\{([\s\S]*)\}$/) !== null) {
           return eval("(" + value + ")");
       } else {
           return value;
       }
    });
    return jsonResult;
}

$(
    function () {
        let chart1 = echarts.init(document.getElementById('general_pies'), 'white', {renderer: 'canvas'});
        let windowWidth = $(window).width();
        $.ajax({
            type: "GET",
            url: "/api/v1/general_pies?w="+windowWidth,
            dataType: 'json',
            success: function (result) {
                chart1.setOption(get_json_result(result));
            }
        });
    }
)